<template>
	<view class="container">
		<uni-list>
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'person-filled' }" title="头像">
				<template v-slot:footer>
					<image class="slot-image" :src="avatar" mode="widthFix"></image>
				</template></uni-list-item>
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'person-filled' }" title="姓名"
				:rightText="form.realName" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'person-filled' }" title="性别"
				:rightText="form.sex" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'email-filled' }" title="民族"
				:rightText="form.nation" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="身份证号"
				:rightText="form.idNum" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'staff-filled' }" title="出生日期"
				:rightText="form.birthdate" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="年龄"
				:rightText="String(form.age)" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="政治面貌"
				:rightText="form.political" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="入党（团）时间"
				:rightText="form.joinpartyDate" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="籍贯"
				:rightText="form.nativePlace" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="联系电话"
				:rightText="form.phone" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="电子邮箱"
				:rightText="form.mail" />
			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="联系人"
				:rightText="form.urgentContact" />
			<!-- <uni-list-item
        showExtraIcon="true"
        :extraIcon="{ type: 'calendar-filled' }"
        title="联系人电话"
        :rightText="form.endDate"
      /> -->
<!-- 			<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" ellipsis='1' title="家庭住址"
				:rightText="form.homeAddress" /> -->
			<view style="display: flex; padding-left: 26rpx;padding-right: 26rpx; align-items: center;">
				<uni-icons type="location-filled" size="20"></uni-icons>
				<view style="margin-right: 30rpx; font-size: 14px;">家庭住址</view>
				<text v-if="isShowAllDz" style="margin-right: 30rpx; margin-top: 30rpx; margin-bottom: 30rpx; flex: 1; color: gray;font-size: 13px;">{{form.homeAddress}}</text>
				<view v-else style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;margin-right: 30rpx; margin-top: 30rpx; margin-bottom: 30rpx; flex: 1; color: gray;font-size: 13px;">{{form.homeAddress}}</view>
			</view>

		</uni-list>
	</view>
</template>

<script>
	import isHaveBug from "../../../utils/bug";
	import {
		getInduction
	} from "@/api/hrm/staff/induction";
	import {
		getDicts
	} from "@/api/system/dict/data.js";

	export default {
		data() {
			return {
				isShowAllDz:true,
				form: {},
				sysUserSex: [],
				nationList: [],
				politicalStatus: [],

			};
		},
		computed: {
			avatar() {
				if (!isHaveBug("HR-APP-006")) {
					return "/static/images/user_default_icon.jpg";
				} else {
					return this.$store.state.user.avatar;
				}
			},
		},
		onLoad() {
			if (isHaveBug("HR-APP-005")) {
				uni.setNavigationBarTitle({
					title: "个人信息"
				})
			}
			if (isHaveBug("HR-APP-007")){
				this.isShowAllDz = false
			}
			Promise.all([
					getDicts("sys_user_sex"),
					getDicts("nation_list"),
					getDicts("political_status"),
				])
				.then(([sysUserSex, nationList, politicalStatus]) => {
					this.sysUserSex = sysUserSex.data;
					this.nationList = nationList.data;
					this.politicalStatus = politicalStatus.data;

					// 在字典数据加载完成后调用 getUser
					this.getUser();
				})
				.catch((error) => {
					console.error("Error loading dictionary data:", error);
				});
		},
		methods: {
			getUser() {
				let tokenList = uni.getStorageSync("storage_data") || {};
				let id = tokenList.vuex_id;

				console.log("userId", id)
				getInduction(id)
					.then((response) => {
						this.form = response.data;

						// 性别
						let userSex = this.sysUserSex.find(
							(item) => item.dictValue == this.form.sex
						);
						this.form.sex = userSex.dictLabel;

						// 民族
						let nation = this.nationList.find(
							(item) => item.dictValue == this.form.nation
						);
						this.form.nation = nation.dictLabel;

						// 政治面貌
						let political = this.politicalStatus.find(
							(item) => item.dictValue == this.form.political
						);
						this.form.political = political.dictLabel;
						this.form.homeAddress = "可接受的咖啡机三等奖甲方大开杀戒副书记额飞机当升科技付了款王府井咖色就是看见到克里斯丁"
					})
					.catch((error) => {
						console.log(error);
					});
			},
		},
	};
</script>

<style lang="scss">
	page {
		background-color: #ffffff;
	}

	.slot-image {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		margin-right: 10px;
		width: 30px;
		height: 30px;
	}
</style>